﻿<div ng-init="init();" class="kmi-layout-content SLI01-content">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left" ng-click="back();">
            <i class="material-icons">&#xE408;</i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="brand-title">
            <div class="custom" ng-if="companyName">
                <div class="title" ng-bind="companyName"></div>
                <img src="" alt="" class="brand">
                <div class="gap"></div>
            </div>
            <div class="digiwin">
                <img src="image/smes_v340/logo_ch.png" alt="">
                <img src="image/smes_v340/logo_en.png" alt="">
            </div>
        </div>
        <div class="header-title" ng-bind="'SLI01.title' | translate"></div>
        <!-- 20220727 modify by Alan for#100246 : 修正設定icon -->
        <button ng-click="setting();">
            <img src='image/smes_v340/setting.png'></img>
            <div class='kmi-can-click'></div>
        </button>
        <div class="header-logo"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page list">
            
            <div class="C00-content" ng-class="[isClose?'is-close':'', condition_item.data_type]">
                <div class="trigger-btn-fields">
                    <div class="close-btn" ng-click="isClose = !isClose">
                        <i class="material-icons close">indeterminate_check_box</i>
                        <i class="material-icons open">add_box</i>
                        <div class="kmi-can-click"></div>
                    </div>
                </div>
                <div class="kmi-text-fields conditoin-fields">
                    <label class="label" ng-bind="'C00.query_conditon' | translate"></label>
                    <input class="column_name" type="text" ng-model="columnInfo.name" readonly="readonly" ng-click="loadCodeList();" placeholder="{{'C00.field'|translate}}"></input>
                    <div class="tip"><i class="material-icons">&#xE5CF;</i></div>
                    <input class="query_mode" type="text" ng-model="typeInfo.name" readonly="readonly" ng-click="loadTypeList();" placeholder="{{'C00.condition'|translate}}"></input>
                    <div class="tip"><i class="material-icons">&#xE5CF;</i></div>
                    <!--文字輸入-->
                    <input class="column_value" type="text" ng-model="columnValue" placeholder="{{'C00.value'|translate}}"></input>
                    <!--開窗查詢-->
                    <!-- 20210127 add FOR #78814-->
                    <div class="tip search" ng-if="condition_item.column_query"><i class="material-icons" ng-click="condition_item.column_query(condition_item);">search</i></div>
                    <button class="mdl-button mdl-js-button mdl-button--icon mdl-button--icon_prime" ng-click="addCondition(0);">
                        <img src="image/icons/add.png"></img>
                    </button>
                </div>
                <div class="kmi-text-fields conditoin-fields" ng-if="condition_item.data_type == 'SE'">
                    <label class="label" ng-bind="'common.report.default_date.title' | translate"></label>
                    <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="changeDate(condition_item, 3);" style="width:150px;">
                        <img ng-show="condition_item.date_type!=3" src="image/icons/check0.png"></img>
                        <img ng-show="condition_item.date_type==3" src="image/icons/check1.png"></img>
                        {{'common.report.default_date.day' | translate}}
                    </button>
                    <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="changeDate(condition_item, 7);" style="width:150px;">
                        <img ng-show="condition_item.date_type!=7" src="image/icons/check0.png"></img>
                        <img ng-show="condition_item.date_type==7" src="image/icons/check1.png"></img>
                        {{'common.report.default_date.week' | translate}}
                    </button>
                    <button class="mdl-button mdl-js-button kmi-checkbox" ng-click="changeDate(condition_item, 30);" style="width:150px;">
                        <img ng-show="condition_item.date_type!=30" src="image/icons/check0.png"></img>
                        <img ng-show="condition_item.date_type==30" src="image/icons/check1.png"></img>
                        {{'common.report.default_date.month' | translate}}
                    </button>
                    <div style="width: 32px;"></div>
                </div>
                <div class="kmi-text-fields" style="height: 60px;align-items: flex-start;">
                    <label class="label" ng-bind="'C00.select_conditon' | translate" style="line-height:34px;"></label>
                    <div class="condition-content perfect-scrollbar" suppress-scroll-x="false">
                        <div class="condition" ng-repeat="condition in conditionList track by $index">
                            <label ng-bind="condition.desc"></label>
                            <button class="mdl-button mdl-button--icon" ng-click="removeCondition($event, $index);" style="z-index:1;">
                                <img src="image/icons/delete.png"></img>
                            </button>
                            <div class="kmi-can-click" ng-click="selectCondition($index, condition);"></div>
                        </div>
                    </div>
                </div>
                <div class="btn-fields">
                    <div class="kmi-button kmi-button-confrim" ng-click="search();" style="width:100px">
                        <label ng-bind="'common.btn.search' | translate"></label>
                        <div class="kmi-can-click"></div>
                    </div>
                    <!-- 20190809 modify by WeiTing for M#60871: 拿掉 ng-disabled，調整成匯出不必先查詢，就能直接按匯出。 -->
                    <div class="kmi-button kmi-button-confrim" style="width:100px">
                        <label ng-bind="'common.btn.export' | translate"></label>
                        <div class="kmi-can-click" ng-click="export();"></div>
                    </div>
                </div>
            </div>
            <div class="kmi-list column-selector" style="height:80%;text-align:center;">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column1' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column6' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column2' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column3' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column4' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SLI01.list.column5' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in andonDataList track by $index">
                        <div class="kmi-list__column" style="flex:1;" ng-bind="item.EQUIPMENTNO"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="item.EquipmentName"></div>
                        <div class="kmi-list__column" style="flex:1;">
                            <div class="stamp-icons" style="margin: 0px auto;" ng-style="{'background':item.EquipmentColour}" ng-if="item.SLEquipment == 0 || item.SLEquipment == '0'"></div>
                            <div class="stamp-icons" style="margin: 0px auto;" ng-style="{'background':item.EquipmentColour}" ng-click="toAndonDetail(item.SLEquipmentId)" ng-if="item.SLEquipment != 0 && item.SLEquipment != '0'"></div>
                        </div>
                        <div class="kmi-list__column" style="flex:1;">
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.QualityColour}" ng-if="item.SLQuality == 0 || item.SLQuality == '0'"></div>
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.QualityColour}" ng-click="toAndonDetail(item.SLQualityId)" ng-if="item.SLQuality != 0 && item.SLQuality != '0'"></div>
                        </div>
                        <div class="kmi-list__column" style="flex:1;">
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.MaterialColour}" ng-if="item.SLMaterial == 0 || item.SLMaterial == '0'"></div>
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.MaterialColour}" ng-click="toAndonDetail(item.SLMaterialId)" ng-if="item.SLMaterial != 0 && item.SLMaterial != '0'"></div>
                        </div>
                        <div class="kmi-list__column" style="flex:1;">
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.ProdColour}" ng-if="item.SLProd == 0 || item.SLProd == '0'"></div>
                            <div class="stamp-icons"  style="margin: 0px auto;" ng-style="{'background':item.ProdColour}" ng-click="toAndonDetail(item.SLProdId)" ng-if="item.SLProd != 0 && item.SLProd != '0'"></div>
                        </div>
                        <div class="kmi-can-click" ng-click="itemCheck($index,item);"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
